<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <title>tt</title>
    <meta name="decorator" content="default"/>
    <link href='${pageContext.request.contextPath}/static/jquery/fancybox.css' type="text/css" rel='stylesheet' />
    <link href='${pageContext.request.contextPath}/static/fullcalendar1/fullcalendar/fullcalendar.css' type="text/css" rel='stylesheet' />
    <link href='${pageContext.request.contextPath}/static/fullcalendar1/fullcalendar/fullcalendar.print.css' type="text/css" rel='stylesheet' media='print' />
    <script src='${pageContext.request.contextPath}/static/jquery/jquery-1.9.1.min.js'></script>
    <script src='${pageContext.request.contextPath}/static/jquery/jquery-ui-1.10.2.custom.min.js'></script>
    <script src='${pageContext.request.contextPath}/static/fullcalendar1/fullcalendar/fullcalendar.min.js'></script>
    <script src='${pageContext.request.contextPath}/static/jquery/jquery.fancybox-1.3.1.pack.js'></script>

    <style type="text/css">
        body {
            background-color: #EDEFF0;
            padding-right: 20px;
            height: 100%;
        }
        html{
            height: calc(100% - 103px);
            height: -moz-calc(100% - 103px);
            height: -webkit-calc(100% - 103px);
            overflow: hidden!important;
        }
        #main {
            width: 100%;
            min-width: 954px;
        }

        #main ul {
            float: left;
            list-style: none;
            margin: 0px;
            height: 100%;
        }

        #main li {
            height: 54.5%;
            margin-left: 25px;
            margin-top: 25px;
        }

        #main li > div {
            height: 100%;
            /*height: 270px;*/
        }
        #main li:nth-child(2) > div {
            /*padding-bottom: 50px;*/
        }
        #main li:nth-child(1) > div .content{
            height:calc(100% - 50px);
            height: -moz-calc(100% - 50px);
            height: -webkit-calc(100% - 50px);
            /*padding-top:50px;*/
        }
        .content {
            overflow: hidden;
            width: 100%;
            height:calc(100% - 26px);
            height: -moz-calc(100% - 26px);
            height: -webkit-calc(100% - 26px);
            -webkit-box-shadow: 0 0 7px #AAA;
            -moz-box-shadow: 0 0 7px #AAA;
            box-shadow: 0 0 7px #AAA;
            border-radius: 2px;
            -moz-border-radius: 2px; /* 老的 Firefox */
            background-color: #fff;
            padding: 0px 0px 20px 0px;
        }

        .content1 {
            width: 100%;
            min-height:100%;
            -webkit-box-shadow: 0 0 7px #AAA;
            -moz-box-shadow: 0 0 7px #AAA;
            box-shadow: 0 0 7px #AAA;
            border-radius: 2px;
            -moz-border-radius: 2px; /* 老的 Firefox */
            background-color: #fff;
            padding: 10px 0px 10px 0px;
        }
        #calendar {
            width: 95%;
            margin: 0 auto;
        }

        table {
            width: 100%;
        }

        table td {
            height: 35px;
            padding-left: 15px;
            font-size: 13px;
            font-family: sans-serif;
            font-weight: 500;
            color: #606060;
        }

        table td i {
            margin-right: 5px;
        }

        .title {
            padding: 1px 10px;
            border-bottom: 3px solid red;
            font-size: 18px;
            font-weight: 600;
            cursor: pointer;
        }

        .moreBtn {
            margin-right: 10px;
            float: right;
            cursor: pointer;
        }

        hr {
            width: 100%;
            margin-top: 0px;
            height: 1px;
            border: 0px;
            background-color: #D5D5D5;
            color: #D5D5D5;
        }

        .dateTd {
            width: 80px;
        }

        a {
            color: #606060;
        }
       /* .ui-widget-header{
            border: 1px solid #ddd!important;
        }*/
        .fc-header-title>h2 {
            font-size: 23px;
        margin-top: -6px;}
    </style>





</head>
<body style="height:100%;">
<div id="main" style="height:100%;">
    <ul>
        <li style="overflow: hidden">
            <div>
                <div>
                    <span class="title">通 知</span>
                    <span class="moreBtn"><a href="${ctx}/oa/oaNews/more">More ></a></span>
                    <hr/>
                </div>
                <div class="content">
                    <table class="info">
                        <c:forEach items="${fns:getAllNews()}" var="news" begin="0" end="3">
                            <c:set var="nowDate" value="<%=System.currentTimeMillis()%>"></c:set>
                            <tr>
                                <td>
                                    <i class="icon-volume-up"></i>
                                    <a href="${ctx}/oa/oaNews/getMyAuditNews?id=${news.id}">
                                            ${fns:abbr(news.title,45)}
                                        <c:if test="${nowDate-news.createDate.getTime()<604800000}">
                                            <img src="/static/images/new.gif">
                                        </c:if>

                                        <c:if test="${news.isTopic eq '1'}">
                                            <i class="icon-arrow-up"></i>
                                        </c:if>
                                    </a>
                                </td>
                                <td class="dateTd"><fmt:formatDate value="${news.createDate}"
                                                                   pattern="yyyy-MM-dd"/></td>
                            </tr>
                        </c:forEach>
                    <c:forEach items="${fno:getMyNotify()}" var="notifys" begin="0" end="1">
                            <c:set var="nowDate" value="<%=System.currentTimeMillis()%>"></c:set>
                            <tr>
                                <td>
                                    <i class="icon-volume-up"></i>
                                    <a href="${ctx}/oa/oaNotify/viewForm?id=${notifys.id}">
                                            ${fns:abbr(notifys.title,41)}
                                        <c:if test="${notifys.readFlag == '0'}">
                                            <img src="/static/images/new.gif">
                                        </c:if>
                                    </a>
                                </td>
                                <td class="dateTd"><fmt:formatDate value="${notifys.createDate}"
                                                                   pattern="yyyy-MM-dd"/></td>
                            </tr>
                        </c:forEach>
                    </table>
                </div>
            </div>
        </li>
        <label id="message" style="color:red; font-weight:bold;display: none;">${message}</label>
        <li style="overflow: hidden">
            <div>
                <c:set value="0" var="flowCount"></c:set>
                <div>
                    <span class="title">待办流程</span><span style="color:#fff;font-weight: bold; width:25px;height:25px;display: inline-block;background: url('${ctxStatic}/images/tishi.png') no-repeat ; background-size: 100% 100%;
                        text-align: center; line-height: 25px;"  id="flowCount"></span>
                    <span class="moreBtn"><a href="${ctx}/act/task/todomain1">More ></a></span>
                    <hr/>
                </div>
                <div class="content">
                    <table class="info">
                        <c:forEach items="${fns:getAuditNews()}" var="news">
                            <c:set value="${flowCount + 1}" var="flowCount"></c:set>
                            <c:if test="${flowCount lt 5}">
                            <tr>
                                <td><i class="icon-cogs"></i>
                                    <a href="${ctx}/oa/oaNews/getAuditNews?id=${news.id}">新闻审核：${fns:abbr(news.title,40)}</a>
                                </td>
                                <td class="dateTd"><fmt:formatDate value="${news.createDate}"
                                                                   pattern="yyyy-MM-dd"/></td>
                            </tr>
                            </c:if>
                        </c:forEach>
                        <c:forEach items="${fns:getTodo()}" var="act">
                            <c:set value="${flowCount + 1}" var="flowCount"></c:set>
                            <c:if test="${flowCount lt 5}">
                                <tr>
                                    <td>
                                        <i class="icon-cogs"></i>
                                        <c:set var="task" value="${act.task}"/>
                                        <c:set var="act" value="${act}"/>
                                        <a href="${ctx}/act/task/form?taskId=${task.id}&taskName=${fns:urlEncode(task.name)}&taskDefKey=${task.taskDefinitionKey}&procInsId=${task.processInstanceId}&procDefId=${task.processDefinitionId}&status=${act.status}">
                                                ${act.procDef.name}
                                                    <c:if test="${act.title ne null}">
                                                        ---- ${act.title}
                                                    </c:if>
                                        </a>
                                    </td>

                                </tr>
                            </c:if>
                        </c:forEach>

                        <c:forEach items="${fns:getOaSchedule()}" var="oaSchedule">
                            <c:set value="${flowCount + 1}" var="flowCount"></c:set>
                            <c:if test="${flowCount lt 5}">

                                <tr>
                                    <td><i class="icon-cogs"></i>
                                        <a href="${ctx}/oa/oaSchedule/form?id=${oaSchedule.id}">待办日程：${fns:abbr(oaSchedule.content,40)}</a>
                                    </td>

                                </tr>
                            </c:if>
                        </c:forEach>
                        <script>
                            document.getElementById("flowCount").innerHTML = '${flowCount}';
                        </script>
                    </table>
                </div>
            </div>
        </li>
    </ul>
    <ul style="height:100%;">
        <li style="height:100%;">
            <div style="height:100%;">
                <div>
                    <span class="title">日程安排</span>
                    <span class="moreBtn"><a href="${ctx}/oa/oaSchedule">More ></a></span>
                    <hr/>
                </div>
                <%--<div class="calendar">----------TODO 日历----------------------%>
                <div class="content1">
                    <div id="calendar"></div>
                    <%--</div>-------------------------------%>
                </div>
            </div>
        </li>
    </ul>
</div>


<script>


    $(document).ready(function() {

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();

        $('#calendar').fullCalendar({
            theme: false,
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'

            },
            buttonIcons:false,
            editable: true,
            selectHelper:true,
                allDayDefault:false,
                ignoreTimezone:false,
            defaultView:'agendaWeek',
            allDaySlot:false,
            defaultEventMinutes:20,
            slotEventOverlap:false,
            //查询日程到首页
            events: {

                url: '/a/oa/oaSchedule/calendarEvents.json' ,//你的controller的地址
                type: 'POST',

                color:'#c6e1fa',// 背景色
                textColor:'black'// 文字颜色

            },
        //弹出框添加日程
        dayClick: function(date, allDay, jsEvent, view) {
                var selDate =$.fullCalendar.formatDate(date,'yyyy-MM-dd HH:mm');//格式化日期

                $.fancybox({
                    'type':'ajax',
                    'href':'/a/oa/oaSchedule/form1?date='+selDate
                });
            },

          eventClick: function(calEvent, jsEvent, view) {
			$.fancybox({
				'type':'ajax',
				'href':'/a/oa/oaSchedule/form2?id='+calEvent.id
			});
    	},
    	//显示日程详细信息
    	eventMouseover: function (calEvent, jsEvent, view) {
          var fstart = $.fullCalendar.formatDate(calEvent.start, "yyyy/MM/dd HH:mm");
           var content =calEvent.title;
          var title = $('<div/>').html('日程日期 :'+' '+$.fullCalendar.formatDate(calEvent.start, "yyyy/MM/dd HH:mm")+'&#10;'+'日程内容 :'+' '+ content+'&#13;').text();

         $(this).attr('title',title);  // 鼠标悬浮到title的时候可以设置展现哪些信息

          $(this).css('font-weight', 'normal');

         }


        });

    });



</script>
<script>
    var mainWidth = 0
    $(window).resize(function () {
        changeCss()
    });
    changeCss()
    function changeCss() {
        if ($('#main').width() != mainWidth) {
            mainWidth = $('#main').width()
            $('#main li').width(mainWidth / 2 - 40)
        }
    }


</script>
<link rel="stylesheet" type="text/css" href="/static/css/myjs.css"/>
<script type="text/javascript" src="/static/css/js/myjs.js" ></script>
<script type="text/javascript">
    var mes=document.getElementById('message').innerHTML;
    if(mes!=null&&mes!=""){
        Showbo.Msg.alert(mes);
        setTimeout(function(){
            Showbo.Msg.hide();
        },3000);
    }
</script>
</body>

</html>